<template>
  <div class="Address">
    <van-address-edit
      :area-list="areaList"
      :show-delete="$route.params.id != '0'"
      show-set-default
      show-search-result
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      :address-info="AddressInfo"
      @delete="onDelete"
      :search-result="searchResult"
    />
  </div>
</template>

<script lang="ts">
import { Vue, Component, Prop } from "vue-property-decorator";
import { AddressEdit, Toast } from "vant";
import areaList from "@/model/area";
Vue.use(AddressEdit);
@Component({})
export default class Address extends Vue {
  private areaList = areaList;
  private searchResult = [];
  private AddressInfo = {
    isDefault: false,
    id: 0,
    name: "",
    tel: "",
    province: "",
    city: "",
    county: "",
    addressDetail: "",
    areaCode: "",
  };
  private mounted(): void {
    this.$common.getAuthToken(this.getData);
  }
  private getData() {
    if (this.$route.params.id != "0") {
      this.$post(`logisticsDetails`, {
        logisticsId: Number(this.$route.params.id),
      }).then((res: any) => {
        if (res.code == 0) {
          this.AddressInfo = {
            isDefault: res.data.main == 1 ? true : false,
            id: res.data.logisticsId,
            name: res.data.name,
            tel: res.data.mobile,
            province: res.data.provinceName,
            city: res.data.cityName,
            county: res.data.cityName,
            addressDetail: res.data.address,
            areaCode: res.data.areaCode,
          };
        }
      });
    }
  }
  private onSave(e: any): void {
    let address = {
      logisticsId: e.id,
      address: e.addressDetail,
      areaCode: e.areaCode,
      cityName: e.city,
      countyName: e.county,
      main: e.isDefault == true ? 1 : 0,
      mobile: e.tel,
      name: e.name,
      provinceName: e.province,
      townName: "",
    };
    this.$post(`createLogistics`, address).then((res: any) => {
      if (res.code == 0) {
        Toast.success(`设置成功！`);
        setTimeout(() => {
          this.$router.back();
        }, 1000);
      }
    });
  }
  private onDelete(): void {
    this.$post(`delLogistics`, {
      logisticsId: Number(this.$route.params.id),
    }).then((res: any) => {
      if (res.code == 0) {
        Toast.success(`删除成功！`);
        setTimeout(() => {
          this.$router.back();
        }, 1000);
      }
    });
  }
}
</script>

<style lang="scss" scope>
.Address {
  .van-button--danger {
    background-color: #d2a166;
    border-color: #d2a166;
  }
}
</style>